<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录页面</title>
    <link rel="stylesheet" href="css/login.css">
</head>

<body>
    <!-- 整体布局 -->
    <div class="container right-panel-active">
        <!-- 注册框 -->

        <div class="container_from container--signin">
            <form action="/addUser" class="from" id="from1" th:object="${user}" method="post"
                onsubmit="return checkInput();">
                <h2 class="from_title">注册账号</h2>
                <input type="text" placeholder="User" class="input" name="userName" th:value="*{userName}">
                <label style="color: red;" th:errors="*{userName}"></label>
                <input type="email" placeholder="Email" class="input" name="email" th:value="*{email}">
                <label style="color: red;" th:errors="*{email}"></label>
                <input type="password" placeholder="Password" class="input" name="userPassWord"
                    th:value="*{userPassWord}">
                <label style="color: red;" th:errors="*{userPassWord}"></label>
                <button class="btn" type="submit">点击注册</button>
            </form>
        </div>

        <!-- 登录框 -->

        <div class="container_from container--signup">
            <form action="/login" class="from" id="from2" method="post">
                <h2 class="from_title">欢迎登录</h2>
                <input type="text" placeholder="UserName" class="input" name="userName" th:value="*{userName}">
                <input type="password" placeholder="Password" class="input" name="userPassWord"
                    th:value="*{userPassWord}">
                <label style="color: red;" th:text="${messageInfo}"></label>
                <a href="#" class="link">忘记密码?</a>
                <button class="btn" type="submit">登录</button>
            </form>
        </div>



        <div class="container_overlay">
            <div class="overlay">
                <div class="overlay_panel overlay--right">
                    <button class="btn" id="signup">已有账号,直接登录</button>
                </div>

                <div class="overlay_panel overlay--left">
                    <button class="btn" id="signin">没有账号,点击注册</button>
                </div>

            </div>
        </div>


        <script src="js/login.js"></script>
</body>

</html>